import React,{ useState,createContext } from 'react'
import { Button } from 'antd';

const {Provider,Consumer}=createContext()
function ChildrenA(props) {

  return (
       <div>
            子组件 {props.msg}  
            <Button type="primary" onClick={()=>props.chagneMsg('yyyyyyyyyyyy')}>子传fu</Button> 
            <ChildrenB/> 
       </div>
  )

}

function ChildrenB(props) {

  return (
       <div>
            ChildrenB
            <Consumer>
             {value=><span>{value}</span>}
            </Consumer>
       </div>
  )

}

function ModifyUser() {
  function chagneMsg(data){
    console.log(data)    
   }
  const [msg,setMsg] = useState('这是父组件需要传递的信息');
  const [dataMsg,setDataMsg] = useState('dataMsg');
    return (
      <Provider value={dataMsg}>
        <div>
              <div>组件间的传递关系</div>
              <ChildrenA msg={msg} chagneMsg={chagneMsg}></ChildrenA>
        </div>
      </Provider>
    )
  
}

export default ModifyUser



